<template>
	<div class='project-list-box'>
		<div class='list' v-if="projectEntities">
			<div class='item' v-for="(project, index) in projectEntities" :key="index">
				<div class='top' @click='querySingle(project)'>
					<div class='number-box line'>
						<div class='project-number'>{{project.projectNumber}}</div>
						<div class='status'>
							<uni-tag :text="project.executeStatus"
								:type="project.executeStatus == '正常' ? 'primary' : 'error'" />
						</div>
					</div>
					<div class='name-box line'>{{project.projectName}}</div>
					<div class='partner-box line'>{{project.companyName}}</div>
					<div class='user-box line'>
						<div class='user'>{{project.pmUserName}}</div>
						<div class='user'>{{project.name}}</div>
						<div class="user"
							:class='project.status==0?"executeStatus":(project.status==1?"execute":(project.status==2?"execute":""))'>
							{{project.status==0?'未开始':(project.status==1?'执行中':(project.status==2?'已完成':'已结算'))}}
						</div>
					</div>
					<div class='contract line'>{{project.contractTitle}}</div>
					<div class='product line'>{{project.productName}}</div>
				</div>
				<div class='createTime'>
					<view>
						<text class="iconfont icon-rili"></text>创建时间：
						<uni-dateformat :date="project.createTime" format='yyyy-MM-dd hh:mm:ss'></uni-dateformat>
					</view>
					<view>
						<uni-tooltip placement="top">
							<view>更多</view>
							<template slot="content">
								<a @click="deleteSingle(project)">删除</a>&nbsp;/&nbsp;<a
									@click="updateSingle(project)">编辑</a>
							</template>
						</uni-tooltip>
					</view>
				</div>
			</div>
		</div>
		<uni-load-more iconType="circle" v-if="projectEntities.length" :status="loadingStatus"></uni-load-more>
		<o-empty v-else bg="#f3f3f3"></o-empty>
	</div>
</template>

<script>
	import {
		api,
		post
	} from '@/util/api.js'
	export default {
		data() {
			return {
				projectEntities: [],
				count: 0,
				page: 1,
				limit: 10,
				loadingStatus: 'more'
			}
		},
		created() {
			this.queryList()
		},
		beforeMount() {
			uni.$on('onReachBottomProject', () => { // 监听上拉加载
				this.onReach()
			})
			uni.$on('onPullDownRefreshProject', () => { // 监听下拉刷新
				this.projectEntities = []
				this.count = 0
				this.page = 1
				post(api.ProjectEntities, {
					page: this.page,
					limit: this.limit
				}).then(res => {
					this.projectEntities = res.data
					this.count = res.count
				})
				uni.stopPullDownRefresh()
			})
			uni.$on('addProject', () => {
				this.addProject()
			})
			uni.$on('reloadProjectList', () => {
				uni.$emit('projectList', 'left')
				uni.switchTab({
					url: '/pages/project/ProjectNav'
				})
				this.projectEntities = []
				this.queryList()
			})
		},
		destroyed() {
			uni.$off('onReachBottomProject') // 销毁onReachBottom监听
			uni.$off('onPullDownRefreshProject') // 销毁onPullDownRefresh
			uni.$off('addProject')
			uni.$off('reloadProjectList')
		},
		methods: {
			async queryList() {
				let project = {
					page: this.page,
					limit: this.limit
				}
				let res = await post(api.ProjectEntities, project)
				this.count = res.count
				this.loadingStatus = "more"
				this.projectEntities = [...this.projectEntities, ...res.data]
			},
			//上拉刷新处理
			async onReach() {
				if (this.projectEntities.length >= this.count) {
					return (this.loadingStatus = "no-more")
				}
				this.page++
				this.loadingStatus = "loading"
				await new Promise((resolve) => setTimeout(resolve, 300))
				await this.queryList()
			},
			// 添加项目
			addProject() {
				uni.navigateTo({
					url: '/pages/project/component/AddProject'
				})
			},
			// 查看项目详情
			querySingle(project) {
				uni.navigateTo({
					url: '/pages/project/component/ProjectInfo?id=' + project.id
				})
			},
			deleteSingle(project) {
				uni.showModal({
					title: '提示',
					content: '你确定要删除吗',
					success: function(res) {
						if (res.confirm) {
							post(api.DeleteProject, {
								id: contract.id
							}).then(res => {
								console.log(res)
							})
						} else if (res.cancel) {
							console.log('取消');
						}
					}
				});
			},
			updateSingle(project) {
				uni.navigateTo({
					url: '/pages/project/component/AddProject?id=' + project.id
				})
			}
		}
	}
</script>

<style lang="scss">
	@import '@/static/css/ProjectList.css';
</style>